<template>
  <div class="setting">
    <mt-header fixed title="设置">
      <router-link to="/user" slot="left">
        <mt-button icon="back"></mt-button>
      </router-link>
    </mt-header>
    <div style="margin-top: .8rem">
      <mt-cell title="个人信息" is-link to="/user-mydata">
        <span>进入</span>
        <img slot="icon" src="static/img/personone.png" width="24" height="24">
      </mt-cell>
      <mt-cell title="账号安全" is-link  to="/user-account">
        <img slot="icon" src="static/img/safetwo.png" width="24" height="24">
      </mt-cell>
      <mt-cell title="关于美卖" is-link  to="/user-about">
        <img slot="icon" src="static/img/about.png" width="24" height="24">
      </mt-cell>
      <div @click="loginOut">
        <mt-cell title="退出账号">
          <img slot="icon" src="static/img/out.png" width="24" height="24">
        </mt-cell>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Setting',
  methods: {
    loginOut () {
      alert('退出登录')
      this.$store.commit('REMOVE_COUNT', this.$store.state.token)
      this.$router.push('/')
    }
  }
}
</script>

<style lang="stylus" scoped>
.mint-header
  background: #ec2935
.setting >>> .mint-cell
  border-bottom: .2rem solid #f3f3f3
.setting >>> .mint-cell-wrapper
.setting >>> .mint-cell:last-child
  background-image: none
.setting
  position: absolute
  left: 0
  right: 0
  top: 0
  bottom: 0
  background: #f3f3f3
</style>
